/*侧边栏*/

body
    min-width: 1000px
    min-height: 800px
    margin: 0 auto
    position: relative
    display: none
    background: url('../images/chart-bgc.png') no-repeat
    background-size: 100% 100%
.nav
    // overflow: hidden
    .dropdown-menu
        li 
            cursor: pointer
    div#left-sec
        float: left
        width: 20%
        border-right: 1px solid silver
        height: 50px
    div#right-sec
        float: left
        width: 80%
        height: 51px
        font-size: 20px
        font-weight: bold
        line-height: 50px
        padding-left: 10px
        border-bottom: 1px solid silver
        .btn-group
            float: right
            padding-top: 8px
            padding-right: 50px
        // height: 50px
.side-bar
    background-color: #676461
    font-size: 14px
    width: 20%
    position: absolute
    top: 51px
    bottom: 0
    ul 
        padding: 0 
        margin: 0
        list-style: none
        li 
            color: #acaba7
            cursor: pointer
            height: 50px
            line-height: 50px
            border-bottom: 1px solid black
            padding-left: 20px
            img
                width: 15px
                margin-right: 5px
                &.gray
                    display: inline
                &.white
                    display: none
            &.active
                background-color: #434140
                color: white
                .white
                    display: inline
                .gray
                    display: none
.main
    display: inline-block
    width: 80%
    .chart-container
        padding: 20px
    margin-left: 20%
    .top
        overflow: hidden
        padding: 20px 50px
        .select-wrap
            float: left
            width: 25%
            text-align: center 
    .s-chart-c
        display: none
        background-color: white
        // padding: 30px 0
        position: relative
    
.cartop-car
    float: left
    width: 50%
    padding: 5px
    border-bottom: 1px solid silver
    img
        width: 100px
        height: 100px
    .car-content
        display: inline-block
        vertical-align: top
        width: 140px
        p.car-name
            font-size: 18px
            font-weight: bold
            width: 125%
        p.car-concer
            color: #FFAE3B
            font-size: 16px
            margin-bottom: 0

#Webtop
    padding-bottom: 20px
    #web-top-one
        // width: 30%
        display: inline-block
        vertical-align: middle
        img
            width: 80px
            margin: 0 20px
    #web-left-nine
        width: 79%
        display: inline-block
        vertical-align: middle
        img
            width:60px
            margin: 5px 20px

#Apptop
    padding-bottom: 20px
    #app-top-one
        // width: 30%
        display: inline-block
        vertical-align: middle
        img
            width: 80px
            margin: 0 20px
    #app-left-nine
        width: 79%
        display: inline-block
        vertical-align: middle
        img
            width:60px
            margin: 5px 20px


/*美化下拉菜单*/
select 
    outline: 0
    padding: 3px 5px

/*图表附加部分样式*/
abs(top,left)
    position: absolute
    top:top
    left: left

uniform-addon()
    color: white
    background-color: #2EA0F6
    font-weight: bold
    padding: 5px
    border-radius: 4px

rect(size,color){
    width:size
    height: size 
    border-radius: 4px
    background-color: color
    display: inline-block
}

.addon-sex
    abs 10px 10px
    uniform-addon()
.info-sex
    background-color: white
    overflow: hidden
    img
        width: 20px
    p
        margin: 0
    .male,.female,.unknown
        float: left
        width: 33.33%
        text-align: center
        padding: 20px 0
        font-weight: bold


.addon-family
    abs 10px 10px
    uniform-addon()
.info-family
    background-color: white
    padding: 20px 50px
    font-weight: bold
    span 
        vertical-align: middle
    .rect-have
        rect 15px #F6D234
    .word-have
        color: #F6D234
    .rect-no
        rect 15px #58A2DF
    .word-no
        color:#58A2DF

.addon-vertical
        abs 10px 10px
        uniform-addon()

#vertiacal-media-info
    width: 49%
    display: inline-block
    height: 400px
    vertical-align: top
    background-color: white
    padding: 50px
    font-weight: bold
    table
        width: 100%
        td 
            height: 80px
            span:first-child
                color:#F3AB18

.addon-web
    abs 10px 10px
    uniform-addon()
